<!-- HTML5文件 -->
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8"/>
		<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
		<title>Agile Lite</title>
		<link rel="stylesheet" href="assets/agile/css/agile.layout.css">
		<link rel="stylesheet" href="assets/agile/css/flat/flat.component.css">
		<link rel="stylesheet" href="assets/agile/css/flat/flat.color.css">
		<link rel="stylesheet" href="assets/agile/css/flat/iconline.css">
		<link rel="stylesheet" href="assets/agile/css/flat/animate.css">
		<link rel="stylesheet" href="assets/component/timepicker/timepicker.css">
		<link rel="stylesheet" href="assets/app/css/app.css">
	</head>
	<body>
		<div id="section_container">
			<section id="animate_section" data-role="section" class="active">
				<header>
				    <div class="titlebar">
				    	<a data-toggle="back" href="#"><i class="iconfont iconline-arrow-left"></i></a>
				    	<h1>账户:</h1>
				    </div>
				    <table border="1" width="100%" cellspacing="10px">
				 		<tr>
				 			<td width="40px"></td>
				 			<td width="80px"></td>
				 			<td width="120px"></td>
				 			<td width="40px"></td>
				 			<td width="120px"></td>
				 			<td></td>
				 		</tr>
				 		<tr align="center">
				 			<td></td>
				 			<td>选择时间:</td>
				 			<td>
				 				<div data-role="date" id="date_begin">
							  		<label>请选择日期</label>
							  		<input type="hidden"/>
						  		</div>
				 			</td>
				 			<td>至</td>
				 			<td>
				 				<div data-role="date" id="date_end">
							  		<label>请选择日期</label>
							  		<input type="hidden"/>
						  		</div>
				 			</td>
				 			<td></td>
				 		</tr>
				 	</table>
				</header>
				<article data-role="article" id="main_article" data-scroll="verticle" class="active" style="top:144px;bottom:0px;">
					<div class="scroller">  
			    		<ul class="listitem">
			    			<li class="zoomIn animated-long">11111111</li>
			    			<li class="rotateInDownLeft animated-long">11111111</li>
			    			<li class="zoomIn animated-long">11111111</li>
			    			<li class="rotateInDownLeft animated-long">11111111</li>
			    			<li class="zoomIn animated-long">11111111</li>
			    			<li class="rotateInDownLeft animated-long">11111111</li>
			    			<li class="zoomIn animated-long">11111111</li>
			    			<li class="rotateInDownLeft animated-long">11111111</li>
			    		</ul>
    				</div>  
				</article>
			</section>
		</div>
		
		<!--- third --->
		<script src="assets/third/jquery/jquery-2.1.3.min.js"></script>
		<script src="assets/third/jquery/jquery.mobile.custom.min.js"></script>
		<script src="assets/third/iscroll/iscroll-probe.js"></script>
		<script src="assets/third/arttemplate/template-native.js"></script>
		<!-- agile -->
		<script type="text/javascript" src="assets/agile/js/agile.js"></script>		
		<!--- bridge --->
		<script type="text/javascript" src="assets/bridge/exmobi.js"></script>
		<script type="text/javascript" src="assets/bridge/agile.exmobi.js"></script>
		<!-- app -->
		<script src="assets/component/timepicker/agile.timepicker.js"></script>	
		<script type="text/javascript" src="assets/component/extend.js"></script> 
		<script type="text/javascript" src="assets/app/js/h5.base.js"></script>
		<script type="text/javascript" src="assets/app/js/app.js"></script>
		<!-- my -->
		<script type="text/javascript" src="assets/my/common/my.js"></script>
		
		<script>
			$('#main_article').on('articleload', function(){//监听主页面打开事件,判断是否有COOKIE,并进行自动登录.
				A.Component.datetime('#date_begin').set(getDate(-7));
				A.Component.datetime('#date_end').set(getDate(0));
			});
			$('#date_begin').on('datachange', function(){
				A.alert('开始时间','更改了');
			});
		</script>
	</body>
</html>